<template>
  <section class="component">
    <!-- 名单剔除 审批日志 -->
    <data-box :data="dataSetList" :page="pageService" v-if="disabled">
      <template slot="columns">
        <el-table-column prop="operatorRealName" label="操作人" :min-width="$helper.getColumnWidth(3)"></el-table-column>
        <el-table-column prop="timeCreated" :formatter="row => $filter.dateTimeFormat(row.timeCreated)" label="操作时间" :min-width="$helper.getColumnWidth(5)"></el-table-column>
        <el-table-column prop="operateType" label="变更类型" :formatter="
            row => $filter.dictConvert(row.operateType, 'OperateType')
          " :min-width="$helper.getColumnWidth(4)">
        </el-table-column>
        <el-table-column prop="applyStatus" label="审批状态" :min-width="$helper.getColumnWidth(4)">
          <template slot-scope="scope">
            <div v-if="scope.row.operateType==='CREATE'">- - -</div>
            <div v-else> {{$filter.dictConvert(scope.row.applyStatus,'ApplyStatus')}}</div>
          </template>
        </el-table-column>
        <el-table-column label="操作" :min-width="$helper.getColumnWidth(4)">
          <template slot-scope="scope">
            <el-button @click="showInfo(scope)" type="text">查看详情</el-button>
          </template>
        </el-table-column>
      </template>
    </data-box>
    <!-- 策略管理 剔除日志 -->
    <el-row v-else>
      <data-form :model="model" @onSearch="refreshData">
        <template slot="inputs">
          <el-form-item label="运行时间" prop="maintainDate">
            <el-date-picker :editable="false" clearable type="daterange" v-model="model.maintainDate" start-placeholder="开始日期" end-placeholder="结束日期"></el-date-picker>
          </el-form-item>
        </template>
      </data-form>
      <data-box :data="logDataSetList" @onPageChange="refreshData" :page="pageService">
        <template slot="columns">
          <el-table-column prop="executeTime" label="运行时间" :min-width="$helper.getColumnWidth(3)">
            <template slot-scope="scope">
              <div v-if="scope.row.executeTime===null">- - -</div>
              <div v-else> {{$filter.dateTimeFormat(scope.row.executeTime)}}</div>
            </template>
          </el-table-column>
          <el-table-column prop="strategyStatus" label="运行状态" :formatter="
              row => $filter.dictConvert(row.strategyStatus, 'StrategyStatus')
            " :min-width="$helper.getColumnWidth(3)"></el-table-column>
          <el-table-column prop="caseAmount" label="剔除案件数" :min-width="$helper.getColumnWidth(4)">
            <template slot-scope="scope">
              <div v-if="scope.row.caseAmount===null">- - -</div>
              <div v-else>{{scope.row.caseAmount}}</div>
            </template>
          </el-table-column>
          <el-table-column label="操作" :min-width="$helper.getColumnWidth(4)">
            <template slot-scope="scope">
              <el-button @click="showInfo1(scope)" type="text">查看详情</el-button>
            </template>
          </el-table-column>
        </template>
      </data-box>
    </el-row>
    <!-- 审批记录弹框 -->
    <el-dialog title="名单剔除" :center="true" :visible.sync="dialog.modify" width="900px" :close-on-press-escape="false" append-to-body @open="$nextTick(() => $refs['add-list-item'].reset())">
      <add-list-item :roleData="roleObj" @close="dialog.modify = false" @refreshList="refreshData" ref="add-list-item"></add-list-item>
    </el-dialog>
    <!-- 剔除日志 -->
    <el-dialog title="剔除日志" :center="true" :visible.sync="dialog.log" width="1200px" append-to-body :close-on-press-escape="false" @open="$nextTick(() => $refs['log-details'].refreshData())">
      <log-details :roleData="roleObj" @close="dialog.log = false" @refreshList="refreshData" ref="log-details"></log-details>
    </el-dialog>
  </section>
</template>

<script lang="ts">
import Vue from "vue";
import Component from "vue-class-component";
import { Dependencies } from "~/core/decorator";
import { Prop, Watch } from "vue-property-decorator";
import SeeLogItem from "./see-log-item.vue";
import AddListItem from "./add-list-item.vue";
import { ListRemovedService } from "~/services/domain-service/list-removed.service";
import { EliminateStrateguLogService } from "~/services/domain-service/eliminate-strategy-log.service";
import LogDetails from "./log-details.vue";
import { PageService } from "~/utils/page.service";
import { OPERATION_TYPE } from "~/config/enum.config";
@Component({
  components: {
    LogDetails,
    AddListItem
  }
})
export default class DivisionLog extends Vue {
  @Dependencies(ListRemovedService)
  private listRemovedService: ListRemovedService;
  @Dependencies(EliminateStrateguLogService)
  private eliminateStrateguLogService: EliminateStrateguLogService;
  @Dependencies(PageService)
  private pageService: PageService;
  @Prop({
    type: Object
  })
  private modifyData: any;
  @Prop() private eliminateType: string
  private roleObj: any = {};
  private disabled: any = true;
  private dialog: any = {
    modify: false,
    log: false
  };
  // 页面按钮类型
  private operationType: any = OPERATION_TYPE
  private dataSetList: any = [];
  private logDataSetList: any = [];
  private model: any = {
    maintainDate: []
  };

  private showInfo (scope) {
    this.roleObj = { ...scope.row };
    this.operationType.DEFAULT = 'APPROVAL_LOG'
    this.dialog.modify = true;
  }
  private showInfo1 (scope) {
    this.roleObj = { ...scope.row };
    this.dialog.log = true;
  }
  private refreshData () {
    this.operationType.DEFAULT === 'APPROVAL_LOG' ? this.disabled = true : this.disabled = false
    const data = { id: this.modifyData.id };
    if (this.modifyData.type === "RuleRm") {
      const newData: any = this.paramsHandler();
      const mergeData = { ...data, ...newData };
      this.eliminateStrateguLogService
        .queryStrategy(mergeData, this.pageService)
        .subscribe(data => {
          this.logDataSetList = data;
        });
    } else {
      this.listRemovedService
        .getNameLogList(data, this.pageService)
        .subscribe(data => {
          this.dataSetList = data;
        });
    }
    this.operationType.DEFAULT = ''
  }

  private paramsHandler () {
    const params = { ...this.model };
    params.startTime = this.$filter.dateRanageFormat(
      this.model.maintainDate
    ).start;
    params.endTime = this.$filter.dateRanageFormat(this.model.maintainDate).end;
    params.eliminateType = this.eliminateType
    delete params.maintainDate;
    return params;
  }
}
</script>

<style></style>
